<!doctype html>
<html class="no-js">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>{$site_title}</title>
  <meta name="description" content="">
  <meta name="keywords" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp" />
  <link rel="stylesheet" type="text/css" href="http://apps.bdimg.com/libs/blendui/2.0.0/boost.min.css" />
  <link rel="stylesheet" type="text/css" href="{$resource_basic}/css/webapp.css" />
  <script type="text/javascript" src="{$resource_basic}/js/jquery.min.js"></script>
  <script type="text/javascript" src="http://apps.bdimg.com/libs/blendui/2.0.0/boost.min.js"></script>
  <script type="text/javascript">
    window.boost = $.noConflict(true);
  </script>
  <style>
  body{ width: 100%; height: 100%; background-image: url(__PUBLIC__/template/default/img/aclover/guess_options_result_background.jpg);background-repeat:no-repeat; background-size: 100%; background-color: #fd6ea1;}
  .blend-panel-body{border-bottom:0px; padding-bottom: 0px; padding-top: 0px;}
  .blend-formgroup{
    margin-top: 10px;
    background-color: transparent; 
  }
  .blend-formgroup-input{background-color: rgba(247, 243, 243, 0.4); border-radius:5px;}
  .blend-button-primary{ border-radius:5px; }
  .blend-tab-header-active{ background-color: #ff6666;}
  .blend-formgroup-label{ width: 60px; background-color: none;}
  .blend-container-fluid{ margin-left: 0px; padding-left: 0; padding-right: 0;}
  .blend-card-content-view{
    position: absolute;
    left:22%;
    top:10%;
    width: 70%;
  }
  .blend-tab-header{ border-radius:5px;}
  .blend-card-title{ color: #cccccc; font-size: 15px;}
  .blend-card{ height: 130px;}
  .user_check{ text-align: left;}
  [class*=blend-col-]{
          background: none;
          border: none;
      }
    #top_title{
       color: #ffffcc; font-size:1.6rem; line-height:10px; 
    }
    .blend-formgroup-input{
        color:#fff;font-weight: 700;font-size: 1.6rem;
    }
    .blend-formgroup-label img{
        width: 30px;
    }
    .blend-button{
        background-color:rgba(247, 243, 243,0); border:1px solid #FFFF99;font-weight: 700; 
    }
    
    .chosen_options{
        line-height: 18px;width:70%; border: none; min-height:30px; margin:0 auto; margin-top:-60px; position:absolute; left:90px;display: block; word-wrap: break-word;
    }
    
    
    /*iphone5*/
    @media screen and (min-width: 320px)
    {
       #top_title{
          color: #ffffcc; font-size:1.2rem; line-height:10px; 
       } 
       .blend-formgroup-input{
        color:#fff;font-weight: 700;font-size: 1.1rem;
        }
        .blend-formgroup-label img{
        width: 25px;
        }
        .blend-button{
           font-size:1.8rem; 
        }
        .blend-card-img-view{
            width: 50px;
            height: 50px;
        }
        
        .chosen_options{
            left: 76px;
        }
    }
    
    /*iphone6*/
    @media screen and (min-width: 375px)
    {
       #top_title{
          color: #ffffcc; font-size:1.3rem; line-height:10px; 
       } 
       .blend-formgroup-input{
        color:#fff;font-weight: 700;font-size: 1.4rem;
      }
      .blend-formgroup-label img{
        width: 28px;
        }
        .blend-button{
           font-size:1.8rem; 
        }
        .blend-card-img-view{
            width: 60px;
            height: 60px;
        }
        
        .chosen_options{
            left: 88px;
        }
    }
    /*iphone6P*/
    @media screen and (min-width: 414px)
    {
       #top_title{
          color: #ffffcc; font-size:1.5rem; line-height:10px; 
       }
       .blend-formgroup-input{
        color:#fff;font-weight: 700;font-size: 1.6rem;
        }
        .blend-formgroup-label img{
        width: 30px;
        }
        .blend-button{
           font-size:2.1rem; 
        }
        .blend-card-img-view{
            width: 65px;
            height: 65px;
        }
        .chosen_options{
            left: 98px;
        }
    }
    
    /*iphone6P*/
    @media screen and (min-width: 720px)
    {
       #top_title{
          color: #ffffcc; font-size:1.5rem; line-height:10px; 
       }
       .blend-formgroup-input{
        color:#fff;font-weight: 700;font-size: 1.9rem;
        }
        .blend-formgroup-label img{
        width: 30px;
        }
        .blend-button{
           font-size:2.1rem; 
        }
        .blend-card-img-view{
            width: 65px;
            height: 65px;
        }
        .chosen_options{
            left: 98px;
        }
    }
      
    #close{ margin-left: 42%; margin-top: -7%; position: absolute;}  
      
  </style>
</head>

<body>
    <if condition="$iscreated eq 1">
    <div class="blend-dialog-mask" style="opacity: 0.5; height: 2529px;"></div>
    <div class="blend-panel-body" id="sharetoshow" style="position: absolute; z-index: 1000; margin-top: 50px;">
        <div class="blend-panel-center">
            <img id="fenxiang_img" src="__PUBLIC__/template/default/img/aclover/07_03.png" style="width:100%; margin-top:-10%;">
            <div id="close" style="width:30px; height:30px;"></div>
        </div>
    </div>
    </if>
    <div class="blend-panel-body">
        <div class="blend-panel-left" style="color: #F0154D; font-size:1.2rem; line-height:10px; padding-bottom:10px; margin-left:5%;">
            <b>
            <p style="line-height:4px; margin-top:20px;">勾选或自己编辑你要对Ta说的话，点击确定发给Ta</p>
            <p>以下选项皆可修改,点击" 换一套 "更多情话供你选</p>
            </b>
        </div>
        <form action="{:U('M/aclover/create_options')}" method="post">
        <div class="blend-grid blend-container-fluid">
            <div class="blend-formgroup">
                <label class="blend-formgroup-label"><img src="__PUBLIC__/template/default/img/aclover/02.png" data-id="1" class="select_imgs" style="width:30px;"></label>
                <input type="text" name="option1" required="required" class="blend-formgroup-input" value ="{$random_answers[0]['item']}"/>
            </div>
            <div class="blend-formgroup">
                <label class="blend-formgroup-label"><img src="__PUBLIC__/template/default/img/aclover/01.png" data-id="2" class="select_imgs" style="width:30px;"></label>
                <input type="text" name="option2" required="required" class="blend-formgroup-input" value ="{$random_answers[1]['item']}">
            </div>
            <div class="blend-formgroup">
                <label class="blend-formgroup-label"><img src="__PUBLIC__/template/default/img/aclover/01.png" data-id="3" class="select_imgs" style="width:30px;"></label>
                <input type="text" name="option3" required="required" class="blend-formgroup-input" value ="{$random_answers[2]['item']}"/>
            </div>
            <div class="blend-formgroup">
                <label class="blend-formgroup-label"><img src="__PUBLIC__/template/default/img/aclover/01.png" data-id="4" class="select_imgs" style="width:30px;"></label>
                <input type="text" name="option4" required="required" class="blend-formgroup-input" value ="{$random_answers[3]['item']}"/>
            </div>
            <div class="blend-formgroup">
                <label class="blend-formgroup-label"><img src="__PUBLIC__/template/default/img/aclover/01.png" data-id="5" class="select_imgs" style="width:30px;"></label>
                <input type="text" name="option5" required="required" class="blend-formgroup-input" value ="{$random_answers[4]['item']}"/>
            </div>
            <div class="blend-formgroup">
                <label class="blend-formgroup-label"><img src="__PUBLIC__/template/default/img/aclover/01.png" data-id="6" class="select_imgs" style="width:30px;"></label>
                <input type="text" name="option6" required="required" class="blend-formgroup-input" value ="{$random_answers[5]['item']}"/>
            </div>
        </div>
        <input type="text" id="right_option" name="right_option" value="1" hidden="hidden" />
        <div class="blend-grid blend-container-fluid" style="margin-top:10px;">
            <div class="blend-row">
                <span class="blend-col-5"><button style="background-color:rgba(255, 255, 255,0); border-color:#ffffcc;" class="blend-button blend-button-primary blend-button-large" id="reset_answers" type="button">换一套</button></span>
                <span class="blend-col-7"><button style="background-color:rgba(255, 255, 255,0); border-color:#ffffcc;" class="blend-button blend-button-primary blend-button-large success">确定</button></span>
            </div>
        </div>
        </form>
        <div class="blend-panel-center" style="background-color:#fff; width:100%; min-height:120px; border-radius:5px; margin-top:30px;">
            <section class="blend-tab">
                <div class="blend-tab-header">
                    <div class="blend-tab-header-item">Ta的猜题</div>
                    <div class="blend-tab-header-item">我的猜题</div>
                    <div class="blend-tab-header-active"></div>
                </div>
                <div class="blend-tab-content">
                    <div class="blend-tab-content-item"><br>
                        <empty name="friend_guess">
                        <span style="color:#666666;">Ta还没有猜过哦，快去考考Ta吧~</span>
                        <else />
                        <volist name="friend_guess" id="fvo">
                            <div class="blend-card blend-card-no-icon">
                            <div class="blend-card-img-view">
                                <img src="{$fvo.avatar}" style=" width:70%; height:70%; border-radius:100%;">
                            </div>
                            <div class="blend-card-content-view">
                                <div class="blend-card-title" style="float:left;">
                                    {$fvo.to_username}
                                </div>
                                <p class="blend-card-text" style="float:right; color:#cccccc;">{$fvo.ctime|date="Y-m-d H:i",###}</p>
                                <if condition="$fvo.result eq 1">
                                <p class="blend-card-text" style="float:left; margin-top:5px; text-align: left;"><b>哎呦~Ta猜对了，乖乖的接受{$fvo.to_username}的惩罚吧~</b></p>
                                <else/>
                                <p class="blend-card-text" style="float:left; margin-top:5px;text-align: left;"><b>哈哈~Ta猜错了，{$fvo.to_username}任由你发落啦~</b></p>
                                </if>
                            </div>
                            </div>
                            <div style="width:70%; border: none; min-height:30px; margin:0 auto; margin-top:-60px; position:absolute; left:23%;"><p class="user_check" style="margin:0;  margin-left:2px; color:#989393;">Ta选择了  "{$fvo.option}"</p></div>
                        </volist>
                        </empty>
                    </div>
                    <div class="blend-tab-content-item"><br>
                        <empty name="my_guess">
                        <span style="color:#666666;">你还没有猜过哦，赶紧邀请Ta出题吧~</span>
                        <else />
                        <volist name="my_guess" id="mvo">
                        <div class="blend-card blend-card-no-icon">
                            <div class="blend-card-img-view">
                                <img src="{$mvo.avatar}" style=" width:70%; height:70%; border-radius:100%;">
                            </div>
                            <div class="blend-card-content-view">
                                <div class="blend-card-title" style="float:left;">
                                    {$mvo.to_username}
                                </div>
                                <p class="blend-card-text" style="float:right; color:#cccccc;">{$mvo.ctime|date="Y-m-d H:i",###}</p>
                                <if condition="$mvo.result eq 1">
                                <p class="blend-card-text" style="float:left; margin-top:5px;text-align: left;"><b>哈哈~你猜对了,{$mvo.from_username}任由你发落啦~</b></p>
                                <else/>
                                <p class="blend-card-text" style="float:left; margin-top:5px;text-align: left;"><b>哎呦~你猜错了，乖乖的接受{$mvo.from_username}的惩罚吧~</b></p>
                                </if>
                            </div>
                        </div>
                        <div style="width:70%; border: none; min-height:30px; margin:0 auto; margin-top:-50px; position:absolute; left:23%;"><p class="user_check" style="margin:0;  margin-left:2px; color:#989393;">你选择了"{$mvo.option}"</p></div>
                        </volist>
                        </empty>
                    </div>
                </div>
            </section>
        </div>
    </div>

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
//分享

wx.config({
    debug: false,
    appId: '{$signPackage["appId"]}',
    timestamp: {$signPackage["timestamp"]},
    nonceStr: '{$signPackage["nonceStr"]}',
    signature: '{$signPackage["signature"]}',
    jsApiList: [
      // 所有要调用的 API 都要加到这个列表中
       'onMenuShareTimeline',
      'onMenuShareAppMessage'
    ]
});


wx.ready(function () {
// 在这里调用 API
    wx.onMenuShareTimeline({
        title: '情人节，发出你的情话让Ta猜... 这是今年最火爆的情人节猜情话游戏，赶紧去玩！', // 分享标题
        link: "{$site_url}{:U('M/aclover/create_options')}", // 分享链接
        imgUrl: "{$site_url}Public/template/default/img/aclover/wx_shar_logo.jpg", // 分享图标
        type: '', // 分享类型,music、video或link，不填默认为link
        dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
        success: function () { 
          
//            window.location.href = "{:U('M/Acnewyear/create_options')}";
        },
        cancel: function () { 
            // 用户取消分享后执行的回调函数
        }
    });
    
    wx.onMenuShareAppMessage({
        title: '情人节，发出你的情话让Ta猜... ', // 分享标题
        desc: '这是今年最火爆的情人节猜情话游戏，赶紧去玩！', // 分享描述
        link: "{$site_url}{:U('M/aclover/create_options')}", // 分享链接
        imgUrl: "{$site_url}Public/template/default/img/aclover/wx_shar_logo.jpg", // 分享图标
        type: '', // 分享类型,music、video或link，不填默认为link
        dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
        success: function () { 
          
//            window.location.href = "{:U('M/Acnewyear/create_options')}";
        },
        cancel: function () { 
            // 用户取消分享后执行的回调函数
        }
    });

});


</script>  
    
<script type="text/javascript">
    boost('.blend-tab').tab({
    animate: true,        // 切换时地步标示是否使用动画，默认是true
    start: 0            // 初始化指定展示tab的索引，默认是0
});

    $(".select_imgs").click(function(){
       $(".select_imgs").attr("src","__PUBLIC__/template/default/img/aclover/01.png");
       $(this).attr("src","__PUBLIC__/template/default/img/aclover/02.png");
       var right_option = $(this).attr('data-id');
       // alert(right_option);
       $("#right_option").val(right_option);
    });

    $("#reset_answers").click(function(){
        var now_url = window.location.href;
        window.location.href = now_url;
    });
</script>

   <script type="text/javascript">
    $("#close").bind('click',function(){
        $(".blend-dialog-mask").hide();
        $("#sharetoshow").hide();
    });
</script>
    
<?php require_once 'cs.php';echo '<img src="'._cnzzTrackPageView(1256622573).'" width="0" height="0"/>';?>
<include file="Index/foot_analyze"/>
</body>
</html>